// SPDX-License-Identifier: GPL-3.0-or-later

import QtQuick
import QtQuick.Layouts
import QtQuick.Controls
import Fk
import Fk.Pages
import Fk.Common
import Fk.RoomElement
import Qt5Compat.GraphicalEffects

GraphicsBox {
  id: root

  property var choices: []
  property var all_choices: []
  property string prompt : ""
  property string result : ""

  title.text: Util.processPrompt(prompt)
  width: 650
  property int mainHeight : 190
  height: mainHeight

  Flickable {
    id : cardArea
    anchors.topMargin: 30
    anchors.leftMargin: 20
    anchors.rightMargin: 20
    anchors.fill: parent
    contentHeight: gridLayout.implicitHeight
    clip: true

    GridLayout {
      id: gridLayout
      width: parent.width
      anchors.centerIn: parent
      columns: Math.floor(parent.width / 93)
      rowSpacing: 5
      clip: true

      Repeater {
        id: cardRepeater
        
        model: all_choices
        delegate: Item {
          id: cardItem
          width : cardImageArea.width + 4
          height : cardImageArea.height + 4
          scale: 0.8

          Rectangle {
            width: parent.width
            height: parent.height
            clip : true
            border.color: "#FEF7D6"
            border.width: 2
            radius : 2

            enabled : choices.indexOf(modelData.id) !== -1

            Rectangle {
              id : cardImageArea
              anchors.centerIn: parent
              width : cardImage.width
              height : cardImage.height
              color: "transparent"
              clip : true

              Image {
                id: cardImage
                width: 93
                height: 130
                anchors.centerIn: parent
                source: SkinBank.getCardPicture(modelData.name)

                Image {
                  id: suitItem
                  source: (modelData.suit !== "" && modelData.suit !== "nosuit") ? SkinBank.CARD_SUIT_DIR + modelData.suit : ""
                  x: parent.x + 3
                  y: parent.y + 19
                  width: 21
                  height: 17
                }

                Image {
                  id: numberItem
                  source: (modelData.suit != "" && modelData.number > 0) ? SkinBank.CARD_DIR + "number/" + modelData.color + "/" + modelData.number : ""
                  x: 0
                  y: 0
                  width: 27
                  height: 28
                }

                Avatar {
                  id: fromAvatar
                  x: parent.x + 1/32 * parent.width
                  y: parent.y + 16/32 * parent.height
                  general: modelData.from
                  scale: 0.8
                }
              }
            }

            Rectangle {
              id : cardGrey
              anchors.fill: parent
              anchors.centerIn: parent
              visible: !this.enabled
              color: Qt.rgba(0, 0, 0, 0.7)
              opacity: 0.7
              z: 2
            }

            MouseArea {
              anchors.fill: parent
              anchors.centerIn: parent
              onClicked: {
                result = modelData.id;
                root.close();
              }
            }
          }
        }
      }
    }
  }
}
